<template>
  <div  class="demo-warp">
    <div class="layout">
      <div class="inner"> 
        <slot></slot>

      </div>
    </div> 
  </div> 
    
</template>
<script setup lang="ts" > 
</script>
<style lang="scss" scoped>
 .demo-warp{
  width: 100%; 
  border: 1px solid;
  .layout{
    width: 100%;
    padding-top: 56.25%;
    position: relative;
    .inner{
      position: absolute;
      top: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
    }
  }
 }
</style>